<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" type="text/css" href="../../../css/app.css">
    <link rel="stylesheet" type="text/css" href="../../../css/tabBar.css">
    <link rel="stylesheet" type="text/css" href="./order_detail.css">
    <title>订单详情</title>
</head>

<body>
	<div class="header navigationBar">
      	<div class="wrapper">
          	<span class="header-btn left-btn backtrack"></span>
          	<span class="title">订单详情</span>
      	</div>
  	</div>
  	<div class="container top-container" v-if="orderDetailList!=''" v-cloak>
  		<div class="order_detail_list" >
  			<h2>
          <span v-if="!orderDetailList.group_buying" :class="orderDetailList.yzc_status ? 'yzc_buyer_class' : 'buyer_class'">买家</span>
          <span v-if="orderDetailList.group_buying" :class="orderDetailList.group_buying ? 'group_buyer_class' : ''">拼团</span>
          <span v-html="orderDetailList.user_name"></span>
        </h2>

	  		<div class="order_detail_goods" v-for="item in orderDetailList.goods" @click="openGoodsDetail(item.goods_id)">
	  			<div class="detail_goods_img">
	  				<img :src="item.cover+'?x-oss-process=image/resize,m_lfit,w_960'"/>
	  			</div>
	  			<div class="detail_goods_txt">
	  				<h2 v-html="item.goods_name"></h2>
            <p><span>订单编号：</span><span v-html="orderDetailList.order_sn"></span></p>
            <p><span>订单型号：</span><span v-html="item.option_name"></span></p>
            <p><span>订单数量：</span><span v-html="item.quantity"></span></p>
	  				<p><span>订单金额：</span><u><em v-if="!orderDetailList.yzc_status">¥</em> <em v-if="orderDetailList.yzc_status"><img src="../../../image/shop/yzc_icon.png" alt=""></em> <span v-html="item.price"></span> </u></p>
	  			</div>
	  		</div>
	  		<!-- <div class="order_detail_goods">
	  			<div class="detail_goods_img">
	  				<img src="../../../image/shop/shop_goods.jpg"/>
	  			</div>
	  			<div class="detail_goods_txt">
	  				<h2>标题订单详情，订单详情订单详情订单详情订单详情订单详情</h2>
	  				<b>¥1245</b>
	  			</div>
	  		</div> -->
	  		<ul class="order_detail_info">
	  			<li>
	  				<span>折扣优惠</span>
	  				<div>- <span v-html="orderDetailList.coupon_amount"></span></div>
	  			</li>
          <li v-if="orderDetailList.yzc_status">
	  				<span>运费</span>
	  				<div>
              <span v-if="orderDetailList.express_amount!='0.00'" v-html="'¥'+orderDetailList.express_amount"></span>
              <span v-if="orderDetailList.express_amount=='0.00'" v-html="'包邮'"></span>
            </div>
	  			</li>
	  			<li class="yzc_price">
	  				<span>实付款</span>
	  				<div>
              <span v-if="orderDetailList.yzc_status && orderDetailList.express_amount!='0.00'" v-html="'¥'+orderDetailList.express_amount+' + '"></span>
              <em v-if="!orderDetailList.yzc_status">¥</em><em v-if="orderDetailList.yzc_status"><img src="../../../image/shop/yzc_icon.png" alt=""></em> <span v-html="orderDetailList.order_amount"></span>
            </div>
	  			</li>
	  		</ul>
	  	</div>
	  	<ul class="order_detail_info">
  			<li>
  				<span>订单编号：</span>
  				<div v-html="orderDetailList.order_sn"></div>
  			</li>
  			<li v-if="!(orderDetailList.order_state == 1 || orderDetailList.order_state == 6)">
  				<span>支付交易号：</span>
  				<div v-html="orderDetailList.out_order_sn"></div>
  			</li>
        <li v-if="!(orderDetailList.order_state == 1 || orderDetailList.order_state == 2)">
  				<span>发货快递公司</span>
  				<div v-html="orderDetailList.express_name"></div>
  			</li>
  			<li v-if="!(orderDetailList.order_state == 1 || orderDetailList.order_state == 2)">
  				<span>发货快递单号：</span>
  				<div v-html="orderDetailList.express_sn"></div>
  			</li>
  			<li>
  				<span>时间：</span>
  				<div v-html="orderDetailList.date_add"></div>
  			</li>
  			<li>
  				<span>订购状态：</span>
  				<div><i v-html="orderDetailList.order_state_msg"></i></div>
  			</li>
  		</ul>

  		<ul class="order_detail_info order_detail_person">
  			<li>
  				<span>姓名：</span>
  				<div v-html="orderDetailList.user_name"></div>
  			</li>
  			<li>
  				<span>联系方式：</span>
  				<div v-html="orderDetailList.phone"></div>
  			</li>
  			<li>
  				<span>地址：</span>
  				<div>{{orderDetailList.province}} {{orderDetailList.city}} {{orderDetailList.district}} {{orderDetailList.address}}</div>
  			</li>
  			<li>
  				<span>留言：</span>
  				<div v-html="orderDetailList.comment"></div>
  			</li>
  		</ul>

      <ul class="order_detail_info" v-if="orderDetailList.order_state>=2 && refund_arr">
        <li>
  				<span>货物状态：</span>
  				<div v-html="refund_arr.return_type==1 ? '已收货': '未收货'"></div>
  			</li>
  			<li>
  				<span>退款原因：</span>
  				<div v-html="refund_arr.content"></div>
  			</li>
  			<li>
  				<span>退款金额：</span>
  				<div v-html="refund_arr.price"></div>
  			</li>
        <li>
  				<span>退款说明：</span>
  				<div v-html="refund_arr.remark"></div>
  			</li>
        <li>
  				<span>上传凭证：</span>
  				<div v-for="(item, index) in refund_arr.refund_images">
  				  <img :src="item+'?x-oss-process=image/resize,m_lfit,w_960'" alt="" @click="biggerImg(index)">
  				</div>
  			</li>
      </ul>

      <ul class="order_detail_info" v-if="orderDetailList.order_state>=2 && refund_arr">
        <li>
  				<span>快递公司：</span>
  				<div v-html="refund_arr.express_company"></div>
  			</li>
        <li>
  				<span>快递单号：</span>
  				<div v-html="refund_arr.express_number"></div>
  			</li>
      </ul>

      <ul class="order_detail_info" v-if="orderDetailList.cancel">
        <li>
  				<span>取消原因：</span>
  				<div v-html="orderDetailList.cancel"></div>
  			</li>
      </ul>

  		<div class="order_detail_btn">
        <a href="javascript:void(0);" :class="'full'" v-if="orderDetailList.order_state==3" @click="orderModBtn('shopFlow', orderDetailList.id)">查看物流</a>
  			<!-- <a href="javascript:void(0);" :class="(orderDetailList.order_state==1 || orderDetailList.order_state==4) ? 'full':'half'" v-if="orderDetailList.order_state==1 || orderDetailList.order_state==3 || orderDetailList.order_state==4" @click="orderModBtn('shopChat', orderDetailList.id, orderDetailList.user_info)">联系买家</a> -->
        <a href="javascript:void(0);" :class="(orderDetailList.order_state==2) ? 'full':'half'" v-if="orderDetailList.order_state==2 && orderDetailList.group_buying==1 && orderDetailList.group_status==0">待成团</a>
        <a href="javascript:void(0);" :class="(orderDetailList.order_state==2) ? 'full':'half'" v-if="(orderDetailList.order_state==2 && orderDetailList.group_buying==1 && orderDetailList.group_status==1) || (orderDetailList.order_state==2  && orderDetailList.group_buying!=1)" @click="orderModBtn('shopSend', orderDetailList.id)">发货</a>
        <a href="javascript:void(0);" :class="(orderDetailList.order_state==7) ? 'half':'full'" v-if="orderDetailList.order_state==7" @click="orderModBtn('shopRefundPass', orderDetailList.id)">确认退款</a>
        <a href="javascript:void(0);" :class="(orderDetailList.order_state==7) ? 'half':'full'" v-if="orderDetailList.order_state==7" @click="orderModBtn('shopRefundRefuse', orderDetailList.id)">拒绝退款</a>
        <a href="javascript:void(0);" :class="(orderDetailList.order_state==9 && refund_arr.deal_confirm < 1) ? 'half':'full'" v-if="orderDetailList.order_state==9 && refund_arr.deal_confirm < 1" @click="orderModBtn('shopReturnconfirm', orderDetailList.id)">同意申请</a>
        <a href="javascript:void(0);" :class="(orderDetailList.order_state==9 && refund_arr.deal_confirm == 1) ? 'half':'full'" v-if="orderDetailList.order_state==9 && refund_arr.deal_confirm == 1" @click="orderModBtn('shopReturnPass', orderDetailList.id)">确认退货</a>
        <a href="javascript:void(0);" :class="(orderDetailList.order_state==9) ? 'half':'full'" v-if="orderDetailList.order_state==9" @click="orderModBtn('shopReturnRefuse', orderDetailList.id)">拒绝退货</a>
        <a href="javascript:void(0);" :class="(orderDetailList.order_state>=5 && orderDetailList.order_state!=7 && orderDetailList.order_state!=9) ? 'full':'half'" v-if="orderDetailList.order_state>=5 && orderDetailList.order_state!=7 && orderDetailList.order_state!=9" @click="orderModBtn('shopDel', orderDetailList.id)">删除订单</a>
  		</div>

      <div class="shop_order_refund" @click="close_shop_order_refund">
  			<section>
  				<h2>退款金额</h2>
  				<b>¥{{refundPrice}}</b>
  				<div>
  					<a href="javascript:void(0);" @click="closeRefund">取消</a>
  					<a href="javascript:void(0);" @click="passRefund">确定</a>
  				</div>
  			</section>
  		</div>

      <div class="shop_order_return" @click="close_shop_order_return">
  			<section>
  				<h2>确认退货及退款</h2>
  				<b>¥{{refundPrice}}</b>
  				<div>
  					<a href="javascript:void(0);" @click="closeReturn">取消</a>
  					<a href="javascript:void(0);" @click="passReturn">确定</a>
  				</div>
  			</section>
  		</div>

    </div>
</body>
<script src="../../sea.js" data-main="../../main"></script>
<script type="text/javascript" src="../../vue.js"></script>
<script type="text/javascript" src="./orderDetail.js"></script>
</html>
